<!doctype html>
<html class="no-js">

<head>
    <title>幼儿园</title>
    <#include "/boya/template/meta.html" />
</head>

<body>
    <#import "/boya/template/marc.html" as mc />
    <@mc.content>
        <div id="app" class="page">
            <div class="title">食品及原料配送记录 /</div>
            <div style="margin-bottom: 10px; display: flex; align-items: center;">
                <el-date-picker v-model="dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" unlink-panels="true" :default-value="new Date">
                </el-date-picker>
                <el-select v-model="targetId" clearable filterable placeholder="配送点" v-if="${school.role!0} == 1">
                    <el-option v-for="item in schools" :key="item.id" :label="item.name" :value="item.id">
                    </el-option>
                </el-select>
                <el-select v-model="storageId" clearable filterable placeholder="配送产品" v-if="${school.role!0} == 1">
                    <el-option v-for="item in storages" :key="item.id" :label="item.name" :value="item.id">
                    </el-option>
                </el-select>
                <el-button @click="onSearch"><i class="el-icon-search"></i>搜索</el-button>
            </div>
            <div class="am-btn-group am-btn-group-sm btn-group">
                <button type="button" class="am-btn am-btn-default" @click="add"><i class="am-icon-plus"></i>&nbsp;新增记录</button>
                <button type="button" class="am-btn am-btn-default" @click="addBatch"><i class="am-icon-plus"></i>&nbsp;批量新增</button>
                <button type="button" class="am-btn am-btn-default" @click="genExcel"><i class="am-icon-download"></i>&nbsp;下载表格</button>
            </div>
            <table class="am-table table">
                <thead>
                    <tr>
                        <th>配送日期</th>
                        <th>配送经营点</th>
                        <th>配送产品</th>
                        <th>配送单位</th>
                        <th>保质期限</th>
                        <th>产品批号</th>
                        <th>数量</th>
                        <th>单价</th>
                        <th>金额</th>
                        <th>是否有索证</th>
                        <th>经手人</th>
                        <th>验收人</th>
                        <!-- <th>单位</th> -->
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="(item, index) in list">
                        <td class="am-text-middle">{{ item.date }}</td>
                        <td class="am-text-middle">{{ item.targetName }}</td>
                        <td class="am-text-middle">{{ item.storageName }}</td>
                        <td class="am-text-middle">{{ item.unit }}</td>
                        <td class="am-text-middle">{{ item.exp }}</td>
                        <td class="am-text-middle">{{ item.no }}</td>
                        <td class="am-text-middle">{{ item.count }}</td>
                        <td class="am-text-middle">{{ item.price }}</td>
                        <td class="am-text-middle">{{ accMul(item.count, item.price) }}</td>
                        <td class="am-text-middle">{{ item.prove }}</td>
                        <td class="am-text-middle">{{ item.operator }}</td>
                        <td class="am-text-middle">{{ item.acceptor }}</td>
                        <!-- <td class="am-text-middle">{{ item.schoolName }}</td> -->
                        <td class="am-text-middle">
                            <button class="am-btn am-btn-default am-btn-xs" @click="edit(item.id)">编辑</button>
                            <button class="am-btn am-btn-danger am-btn-xs" @click="del(item.id)"><i class="am-icon-trash"></i>&nbsp;删除</button>
                        </td>
                    </tr>
                </tbody>
            </table>
            <#include "/boya/template/page.html" />
        </div>
    </@mc.content>
    <script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data() {
            return {
                list: [],
                dateRange: '',
                schools: [],
                storages: [],
                targetId: '',
                storageId: ''
            }
        },
        mounted: function() {
            var jsonStr = '${list!}';
            var schoolStr = '${schools!}';
            var storageStr = '${storages!}';
            if (jsonStr != '') {
                this.list = ${list!}
            }
            if (schoolStr != '') {
                this.schools = ${schools!'[]'}
            }
            if (storageStr != '') {
                this.storages = ${storages!'[]'}
            }
            var targetId = '${targetId!""}'
            if (targetId != '') {
                this.targetId = Number(targetId);
            }
            var storageId = '${storageId!""}'
            if (storageId != '') {
                this.storageId = Number(storageId);
            }
            var startTime = '${startTime!""}'
            if (startTime != '') {
                this.dateRange = new Array;
                this.dateRange.push('${startTime!}');
                this.dateRange.push('${endTime!}');
            }
        },
        methods: {
            add() {
                window.location.href = "/boya/exportInfo";
            },
            addBatch() {
                window.location.href = "/boya/exportBatch";
            },
            edit(id) {
                window.location.href = "/boya/exportInfo?id=" + id;
            },
            del(id) {
                confirm("确认删除？", function() {
                    var param = Qs.stringify({
                        id: id
                    });
                    axios({
                            url: '/boya/delExport',
                            method: 'post',
                            data: param,
                            headers: {
                                'Content-Type': 'application/x-www-form-urlencoded'
                            }
                        })
                        .then(function(response) {
                            if (response.data.status == 200) {
                                // msg("删除成功");
                                window.location.reload();
                            } else {
                                msg(response.data.msg);
                                console.log(response.data);
                            }
                        })
                        .catch(function(error) {
                            msg("删除失败");
                            console.log(error);
                        });
                })
            },
            onDateChange(val) {
                var keys = [
                    { key: 'startDate', value: val[0] },
                    { key: 'endDate', value: val[1] }
                ]
                goPage(1, keys)

                // window.location.href = "/boya/exportList?startDate=" + val[0] + "&endDate=" + val[1];
            },
            onTargetChange(val) {
                var keys = [
                    { key: 'targetId', value: val }
                ]
                goPage(1, keys)
            },
            onStorageChange(val) {
                var keys = [
                    { key: 'storageId', value: val }
                ]
                goPage(1, keys)
            },
            onSearch() {
                var self = this;
                var keys = [
                    { key: 'targetId', value: self.targetId },
                    { key: 'storageId', value: self.storageId }
                ]
                if (self.dateRange != null && self.dateRange.length > 1) {
                    keys.push({ key: 'startDate', value: self.dateRange[0] });
                    keys.push({ key: 'endDate', value: self.dateRange[1] });
                } else {
                    keys.push({ key: 'startDate', value: '' });
                    keys.push({ key: 'endDate', value: '' });
                }
                goPage(1, keys);
            },
            genExcel() {
                // console.log(window.location.pathname + window.location.search);
                // window.location.href = '/boya/downloadExportList';
                goDownload()
            },
            onPageChange(val) {
                goPage(val);
            },
            accMul(arg1, arg2) {
                var m = 0,
                    s1 = arg1.toString(),
                    s2 = arg2.toString();
                try { m += s1.split(".")[1].length } catch (e) {};
                try { m += s2.split(".")[1].length } catch (e) {};
                return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m);
            }
        }
    })
    </script>
    <style type="text/css">
    .page {
        padding: 15px;
    }

    .title {
        margin-bottom: 10px;
        font-size: 1.2em;
    }

    .btn-group {
        margin-bottom: 10px;
    }

    .table {
        /*width: auto;*/
    }

    .no-border {
        border: none;
    }
    </style>
</body>

</html>